<style lang="less" scoped>
.cf {
  clear: both;
}

.noDate_page {
  padding-top: 2rem;
}
</style>

<!--司机端签收列表页-->
<template>
  <div class="gridContainer">
    <manage-header></manage-header>
    <header-car :status="6"></header-car>

    <scroller lock-x
              scrollbar-y
              use-pullup
              :height="scrollerHeight"
              v-if="totalRecords > 0"
              :pullup-config="ScrollerConfig"
              ref="Scroller">
      <div>
        <div class="acpt-list"
             v-for="(item, index) in datas">

          <div class="car-pc-title cf listing">
            <span class="f-l"><i class="llse llse-huoche"></i> <b class="atvno">{{item.ATVNo}}</b></span>
            <!-- <em class="f-r"
                v-if="item.PlanRouteState<15">
              <div class="btn ml10"
                   @click="DriverDeparture(item.Driver1Guid,item.VehicleGuid,item.ATVGuid)">发车</div>
            </em> -->
            <!-- <em class="f-r"><div class="btn ml10" @click="transferAll(item.ATVGuid)">整车中转</div></em> -->
          </div>

          <div class="acpt-list">
            <div class="acpt-list-wrap cf"
                 v-for="(bbitem, index) in item.list"
                 :class="index+1 === item.list.length?'mb30':'lineb-dash'">

              <div class="displayflex acpt-list-body lineb">
                <span class="cargo">
                  <i class="iconfont icon-cargo"></i>
                  <p>{{bbitem.OrdersPKGS}}件</p>
                </span>
                <div class="txt flex1">
                  <p class="ft17">{{bbitem.SaleCorpName}}</p>
                  <p>清单数：{{bbitem.ordercount}}</p>
                  <p>联系人：{{bbitem.SendContacts}} {{bbitem.SendContactsTel}}</p>
                  <p>送货地址：{{bbitem.ArrivalAddress}}</p>

                </div>
              </div>
              <div class="btn-grp txt-rit">

                <div class="btn ml10"
                     @click="Delivery(bbitem)">签收</div>
                <div class="btn ml10"
                     @click="transfer(bbitem.Guid,bbitem.SaleCorpGUID, bbitem.SaleCorpName)">拒签</div>
              </div>
            </div>
          </div>
        </div>

      </div>
      <div class="loader-over">没有更多记录了</div>
    </scroller>

    <div class="noDate_page"
         v-if="totalRecords == 0">
      <div class="noDate_icon"><i class="iconfont icon-null"></i></div>
      暂无数据，请通知所属公司派单！
    </div>
    <div class="w100fix"></div>
    <footer-menu :status='1'></footer-menu>
  </div>
</template>

<script>
import manageHeader from "@/components/core/header/manage.header.vue";
import headerCar from '@/components/core/header/driver-progress.vue'
import footerMenu from "@/components/core/footer/manage.footer.vue";
import {
  mapGetters,
  mapState
} from "vuex";

export default {
  components: {
    footerMenu,
    headerCar,
    manageHeader,
  },
  data () {
    return {
      datas: [],

      totalRecords: 0,
      noMore: false,
      ScrollerConfig: {
        content: "",
        downContent: "",
        height: 0,
        loadingContent: "",
        upContent: ""
      },
      Memo: ''
    }
  },
  computed: {
    ...mapState({
      pagetitle: state => state.cfg.appBarTitle,
      showstate: state => state.cfg.showAppBar,
    }),
    ...mapGetters({
      scrollerHeight: "cfg/getConHeight"
    }),
    userinfo () {
      return localStorage.userinfo ? JSON.parse(localStorage.userinfo) : null;
    }
  },
  created () {
    this.getData();
  },
  mounted () {
    this.$store.dispatch("cfg/setConHeight");
  },
  methods: {
    getData () {
      let query = {
        DriverGuid: this.userinfo.StaffID,
        LogState: "56",
      };
      this.Ajax.post("GetJhOrderList", query).then(resp => {
        if (resp.IsSuccess) {
          this.totalRecords = resp.TotalRecords;
          if (resp.Datas && resp.Datas.length > 0) {
            let map = {},
              args = [];
            resp.Datas.forEach((x) => {
              if (!map[x.ATVNo]) {
                args.push({
                  ATVNo: x.ATVNo,
                  ATVGuid: x.AtvGuid,
                  Driver1Guid: x.Driver1Guid,
                  VehicleGuid: x.VehicleGUID,
                  PlanRouteState: x.PlanRouteState,
                  SaleCorpGUID: x.SaleCorpGUID,
                  SaleCorpName: x.SaleCorpName,
                  list: [x]
                });
                map[x.ATVNo] = x;
              } else {
                for (var i = 0; i < args.length; i++) {
                  if (args[i].ATVNo == x.ATVNo) {
                    args[i].list.push(x);
                    break;
                  }
                }
              }
            })
            args = args.sort(by("ATVNo"));
            this.datas = args;
          }
        } else {
          this.Toast({
            message: "列表为空，请稍后刷新"
          });
        }
      });
      let by = function (name) {
        return function (o, p) {
          var a, b;
          if (typeof o === "object" && typeof p === "object" && o && p) {
            a = o[name];
            b = p[name];
            if (a === b) {
              return 0;
            }
            if (typeof a === typeof b) {
              return a < b ? -1 : 1;
            }
            return typeof a < typeof b ? -1 : 1;
          } else {
            throw ("error");
          }
        }
      };
    },
    Delivery (item) {
      this.$router.push({
        path: '/driver/carDoneConfrim',
        query: {
          item: JSON.stringify(item),
        }
      });
    },
    transfer (Guid, SaleCorpGUID, SaleCorpName) {
      this.MessageBox.prompt('请输入拒单原因！').then(({ value, action }) => {
        this.Memo = value;
        this.handleRefuse(Guid, SaleCorpGUID, SaleCorpName);
      });
    },
    handleRefuse (Guid, SaleCorpGUID, SaleCorpName) {
      var self = this;
      let imgList = [];

      var query = {
        Guid: Guid,
        imgurla: imgList,
        SaleCorpGUID: SaleCorpGUID,
        SaleCorpName: SaleCorpName,
        Receiver: this.userinfo.StaffID,
        ReceiverName: this.userinfo.Name,
        Memo: this.Memo
      };
      this.Ajax.post("RefusalreasonConfirmGroup", query).then((res) => {
        if (res.IsSuccess) {
          let self = this;
          this.$vux.toast.show({
            text: '拒签成功',
            type: 'success',
            onHide () {
              location.reload();
              // self.$router.push({
              //   path: "/driver/carDoneGroup"
              // });
            }
          });
        } else {
          this.Toast({
            message: res.ErrorMessage || "出错了，请刷新重试",
          });
        }
      }).catch(e => {
        console.log(e);
        this.Toast({
          message: '出错了，请刷新重试',
        });
      });
    }
  }
}
</script>
